<a class="ui card raised link" target="_blank" href="https://makecode.microbit.org" onclick="tickEvent('makecode.target.click', {'target': 'makecode', 'card': 'microbit'})"
  aria-label="Code the micro:bit">
  <div class="targetlogo">
    <img class="ui centered targetlogo image" src="/static/targets/microbit/logo.portrait.white.svg" alt="micro:bit Foundation logo"
    />
  </div>

  <div class="image">
    <img class="ui large bordered rounded image" src="/static/targets/microbit/microbit.simplified.svg" alt="micro:bit board"
    />
  </div>

  <div class="ui inverted segment labelsegment">
    <span class="ms-font-l ms-fontWeight-semibold">micro:bit</span>
  </div>

  <div class="ui inverted segment actionsegment">
    <span class="ui button large">Code</span>
  </div>
</a>


<a class="ui card raised link" target="_blank" href="https://makecode.adafruit.com" onclick="tickEvent('makecode.target.click', {'target': 'makecode', 'card': 'adafruit'})"
  aria-label="Code the Circuit Playground Express">
  <div class="targetlogo">
    <img class="ui centered targetlogo image" src="/static/targets/adafruit/logo.png" alt="Adafruit logo" />
  </div>

  <div class="image">
    <img class="ui large bordered rounded image" src="/static/targets/adafruit/circuit.simplified.svg" alt="Circuit Playground Express board"
    />
  </div>

  <div class="ui inverted segment labelsegment">
    <span class="ms-font-l ms-fontWeight-semibold">Circuit Playground Express</span>
  </div>

  <div class="ui inverted segment actionsegment">
    <span class="ui button large">Code</span>
  </div>
</a>


<a class="ui card raised link" target="_blank" href="https://minecraft.makecode.com" onclick="tickEvent('makecode.target.click', {'target': 'makecode', 'card': 'minecraft'})"
  aria-label="Code Minecraft">
  <div class="targetlogo">
    <img class="ui centered targetlogo image" src="/static/targets/minecraft/Microsoft-logo_rgb_c-white.png" alt="Microsoft logo"
    />
  </div>

  <div class="image">
    <img class="ui large bordered rounded image" src="/static/targets/minecraft/avatar.svg" alt="Minecraft agent" />
  </div>

  <div class="ui inverted segment labelsegment">
    <span class="ms-font-l ms-fontWeight-semibold">Minecraft</span>
  </div>

  <div class="ui inverted segment actionsegment">
    <span class="ui button large">Code</span>
  </div>
</a>

<a class="ui card raised link" target="_blank" href="https://makecode.mindstorms.com" onclick="tickEvent('makecode.target.click', {'target': 'makecode', 'card': 'ev3'})"
  aria-label="Code the LEGO® MINDSTORMS® EV3">
  <div class="targetlogo">
    <img class="ui centered targetlogo image" src="/static/targets/ev3/lego_education_logo_white.png" alt="LEGO® Education logo"
    />
  </div>

  <div class="image">
    <img class="ui large bordered rounded image" src="/static/targets/ev3/EV3.svg" alt="LEGO® MINDSTORMS® EV3 brick"
    />
    <div class="ui red right ribbon label"> Beta </div>
  </div>

  <div class="ui inverted segment labelsegment">
    <span class="ms-font-l ms-fontWeight-semibold">LEGO MINDSTORMS EV3</span>
  </div>

  <div class="ui inverted segment actionsegment">
    <span class="ui button large">Code</span>
  </div>
</a>


<a class="ui card raised link" target="_blank" href="https://makecode.chibitronics.com" onclick="tickEvent('makecode.target.click', {'target': 'makecode', 'card': 'chibitronics'})"
  aria-label="Code the Chibi Chip">
  <div class="targetlogo">
    <img class="ui centered targetlogo image" src="/static/targets/chibitronics/chibitronics_logo_white.svg" alt="Chibitronics logo"
    />
  </div>

  <div class="image">
    <img class="ui large bordered rounded image" src="/static/targets/chibitronics/chip-outline-simplified.svg" alt="Chibi Chip board"
    />
  </div>

  <div class="ui inverted segment labelsegment">
    <span class="ms-font-l ms-fontWeight-semibold">Chibi Chip</span>
  </div>

  <div class="ui inverted segment actionsegment">
    <span class="ui button large">Code</span>
  </div>
</a>

<a class="ui card raised link" target="_blank" href="https://makecode.seeedstudio.com" onclick="tickEvent('makecode.target.click', {'target': 'makecode', 'card': 'seeed'})"
aria-label="Code the Grove Zero">
<div class="targetlogo">
  <img class="ui centered targetlogo image" src="/static/targets/seeed/Seeed_logo.svg" alt="Seeed logo" />
</div>

<div class="image">
  <img class="ui large bordered rounded image" src="/static/targets/seeed/Seeed_target.svg" alt="Seeed Grove Zero board"
  />
  <div class="ui red right ribbon label"> Beta </div>
</div>

<div class="ui inverted segment labelsegment">
  <span class="ms-font-l ms-fontWeight-semibold">Grove Zero</span>
</div>

<div class="ui inverted segment actionsegment">
  <span class="ui button large">Code</span>
</div>
</a>

<!--
<a class="ui card raised link" target="_blank" href="https://makecode.sparkfun.com" onclick="tickEvent('makecode.target.click', {'target': 'makecode', 'card': 'sparkfun'})"
aria-label="Code the Sparkfun SAMD21 board">
<div class="targetlogo">
  <img class="ui centered targetlogo image" src="/static/targets/sparkfun/sparkfun.logo.white.svg" alt="Sparkfun logo" />
</div>

<div class="image">
  <img class="ui large bordered rounded image" src="/static/targets/sparkfun/sparkfun-dev-breakout.svg" alt="Sparkfun SAMD21 board"
  />
  <div class="ui red right ribbon label"> Beta </div>
</div>

<div class="ui inverted segment labelsegment">
  <span class="ms-font-l ms-fontWeight-semibold">Sparkfun Inventors Kit</span>
</div>

<div class="ui inverted segment actionsegment">
  <span class="ui button large">Code</span>
</div>
</a>
-->

<a class="ui card raised link" target="_blank" href="https://www.makewonder.com/cue_the_cleverbot/explore" onclick="tickEvent('makecode.target.click', {'target': 'makecode', 'card': 'wonder'})"
  aria-label="Code the Cue">
  <div class="targetlogo">
    <img class="ui centered targetlogo image" src="/static/targets/wonderworkshop/w_header_logo_2x.png" alt="Wonder Workshop logo"
    />
  </div>

  <div class="image">
    <img style="width: auto;margin-left:auto;margin-right:auto;" class="ui large bordered rounded image" src="/static/targets/wonderworkshop/cue_hero_mobile.png" alt="Wonder Workshop board"
    />
  </div>

  <div class="ui inverted segment labelsegment">
    <span class="ms-font-l ms-fontWeight-semibold">Cue</span>
  </div>

  <div class="ui inverted segment actionsegment">
    <span class="ui button large">Apps</span>
  </div>
</a>